import React from 'react';
import { observer } from 'mobx-react-lite';
import {
  Table,
} from 'choerodon-ui/pro';
import { message } from 'choerodon-ui';
import { map } from 'lodash';
import Record from 'choerodon-ui/pro/lib/data-set/Record';
import { columns } from '../user-table/columns';
import { useAddUserStore } from '@/routes/work-group/components/add-user/stores';
import Styles from './index.less';
import { workGroupApi } from '@/api';

const AddUserContent = () => {
  const {
    tableDs,
    modal,
    workGroupId,
    refresh,
  } = useAddUserStore();

  modal.handleOk(async () => {
    try {
      const userIds = map(tableDs.selected, (record: Record) => record.get('id'));
      if (!userIds?.length) {
        message.info('请至少选择一名成员');
        return false;
      }
      await workGroupApi.addUserByGroup(workGroupId, userIds);
      refresh && refresh();
      return true;
    } catch (e) {
      return false;
    }
  });

  return (
    <div className={Styles.addUserWrap}>
      <Table dataSet={tableDs} columns={columns} filterBarFieldName="param" />
    </div>
  );
};

export default observer(AddUserContent);
